<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>博客正文</title>
    <link rel="stylesheet" href="css/conmmon.css">
    <link rel="stylesheet" href="css/blog_content.css">
    <link rel="stylesheet" href="editor.md/css/editormd.preview.min.css" />
    <link rel="stylesheet" href="css/review.css">
    <script src="js/jquery.min.js"></script>
    <script src="editor.md/editormd.js"></script>
    <script src="editor.md/lib/marked.min.js"></script>
    <script src="editor.md/lib/prettify.min.js"></script>
    <script src="js/common.js"></script>
</head>
<body>
<div class="nav">
    <img src="img/logo1.jpg" alt="">
    <span class="title">博客系统</span>
    <!-- 用来占据中间位置 -->
    <span class="spacer"></span>
    <a href="myblog_list.html?type=all">主页</a>
    <a href="blog_list.html?id=1">博客大厅</a>
    <a href="blog_add.html">写博客</a>
    <a href="login.html" onclick="log_out()">退出账号</a>
</div>
<!-- 版心 -->
<div class="container">
    <!-- 左侧个人信息 -->
    <div class="container-left">
        <div class="card">
            <img src="img/doge.jpg" class="avtar" alt="">
            <h3 id="username" style="font-size: 50px"></h3>
            <p  style="text-decoration: none;text-align: center;color: #6A6A6A" onclick="gitee()">gitee 地址</p>
            <div class="counter">
                <span>文章</span>
                <span>分类</span>
            </div>
            <div class="counter">
                <span id="count" style="margin-bottom: 10px"></span>
                <span id="type_count" style="margin-bottom: 10px"></span>
            </div>
        </div>
    </div>
    <!-- 右侧内容详情 -->
    <div class="container-right">
        <div class="blog-content">
            <!-- 博客标题 -->
            <h3 id="title"></h3>
            <!-- 博客时间 -->
            <div class="date">发布时间：<span id="updatetime"></span> &nbsp;&nbsp;
                阅读量：<span id="rcount"></span>
            </div>
            <div id="editorDiv">

            </div>
            <div class="comments-section">
                <h2>评论区</h2>
                <!-- 评论列表容器 -->
                <div class="comments-list" id="review">
                    <!-- 每条评论的模板 -->

                    <!-- 动态加载评论的地方 -->
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    var id=getUrlValue("id")
    function gitee(){
        location.href="https://gitee.com/HGtz2222/classroom_code/blob/master/java105/servlet/hello_servlet/src/main/java/login/IndexServlet.java";
    }
    function getreview(){
        jQuery.ajax({
            url:"/article/getreview",
            type:"POST",
            data:{"id":id},
            async:false,
            success:function (result){
                if (result.data!=null){
                    if(result.data!=null && result.data.length>0){
                        var reviewarea="";
                        for (let i = 0; i < result.data.length; i++) {
                            var reviewitem=result.data[i];
                            reviewarea += '<div class="comment" id="comment-template" >';
                            reviewarea += '<p class="username">'+reviewitem.reviewname+'</p >';
                            reviewarea += '<p class="content">'+reviewitem.reviewcontent+'</p >';
                            reviewarea += '<h6 style="margin-left: 33px ;color: #6b6666;width: 50px;font-size: 15px" onclick="delete_review('+reviewitem.id+')">删除</h6>';
                            reviewarea += '<div style="display: flex">';
                            reviewarea += '<textarea placeholder="回复..." class="comment-input" required style="flex: 3" id='+reviewitem.id+'></textarea>';
                            reviewarea += '<button type="submit" class="submit-comment" style="flex: 1" onclick="setresponse('+reviewitem.id+')">回复</button>';
                            reviewarea += '</div>';
                            jQuery.ajax({
                                url:"/article/getresponse",
                                type:"POST",
                                data:{"reviewid":reviewitem.id},
                                async:false,
                                success:function (result1){
                                    if (result1!=null&&result1.data.length>0){
                                        for (let i = 0; i < result1.data.length; i++){
                                            var responseitem=result1.data[i];
                                            reviewarea += '<p class="username">'+"来自"+responseitem.responsename+"的回复"+'</p >';
                                            reviewarea += '<p class="content" >'+responseitem.responsecontent+'</p >';
                                            reviewarea += '<input placeholder="回复..." class="comment-input" required style="flex: 3" id='+responseitem.id+'>';
                                            reviewarea += '<button type="submit" class="submit-comment" style="flex: 1" onclick="setresponse_res('+responseitem.id+','+reviewitem.id+')">回复</button>';
                                            reviewarea += '<h6 style="margin-left: 33px ;color: #6A6A6A;width: 50px;font-size: 15px" onclick="delete_response('+responseitem.id+')">删除</h6>';
                                            reviewarea += '<h6 style="margin-left: 33px ;color: #6A6A6A" onclick="expansion('+responseitem.id+','+reviewitem.id+')">展开更多回复</h6>';
                                            reviewarea += '<div id="'+responseitem.id+'a'+'"></div>'
                                        }
                                    }
                                }
                            })
                            reviewarea += '</div>';
                            jQuery("#review").html(reviewarea);
                        }
                    }
                }
            }
        })
    }
    getreview();
    // 定义一个返回 Promise 的函数
    function expansion(id2,id3){
        jQuery.ajax({
            url:"/article/get_response_res",
            type:"POST",
            data:{"responseid":id2},
            async:false,
            success:function (result1){
                let a=processNestedHashMap(id2,id3,result1.data);
                console.log(a)
                jQuery("#"+id2+"a").html(a);
            }
        })
    }
    function processNestedHashMap(id2,id3,nestedMap) {
        let reviewarea='';
        for (let key in nestedMap) {
            if (nestedMap.hasOwnProperty(key)) {
                console.log(key)
                let cleankey=key.replace(/\{|\}/g,'');
                let [firstPart, secondPart, thiresPart,firthPart] = cleankey.split('=');
                let value = nestedMap[key];
                // 检查值是否为对象，如果是则递归处理
                if (Object.keys(value).length!==0) {
                    reviewarea += '<p class="username">'+"来自"+thiresPart+"对"+firthPart+"的回复"+'</p >';
                    reviewarea += '<p class="content" >'+secondPart+'</p >';
                    reviewarea += '<input placeholder="回复..." class="comment-input" required style="flex: 3" id='+firstPart+'>';
                    reviewarea += '<button type="submit" class="submit-comment" style="flex: 1" onclick="setresponse_res('+firstPart+','+id3+')">回复</button>';
                    reviewarea += '<h6 style="margin-left: 33px ;color: #6A6A6A;width: 50px;font-size: 15px" onclick="delete_response('+firstPart+')">删除</h6>';
                    console.log(reviewarea)
                    let subreviewarea=processNestedHashMap(id2,id3,value);
                    if (subreviewarea){
                        reviewarea += subreviewarea;
                    }
                    console.log(reviewarea)
                }else {
                    console.log(1111111111111)
                    reviewarea += '<p class="username">'+"来自"+thiresPart+"对"+firthPart+"的回复"+'</p >';
                    reviewarea += '<p class="content" >'+secondPart+'</p >';
                    reviewarea += '<input placeholder="回复..." class="comment-input" required style="flex: 3" id='+firstPart+'>';
                    reviewarea += '<button type="submit" class="submit-comment" style="flex: 1" onclick="setresponse_res('+firstPart+','+id3+')">回复</button>';
                    reviewarea += '<h6 style="margin-left: 33px ;color: #6A6A6A;width: 50px;font-size: 15px" onclick="delete_response('+firstPart+')">删除</h6>';
                    console.log(reviewarea);
                }
            }

        }
        return reviewarea;
    }
    function delete_review(id2){
        jQuery.ajax({
            url:"/article/deletereview",
            type:"post",
            data:{"id":id2},
            success:function (result){
                if (result.data>0){
                    alert("删除成功");
                    location.href=location.href;
                }else if (result.data==-1){
                    alert("删除失败");
                }else {
                    alert("没有权限");
                }

            }
        })
    }
    function delete_response(id2){
        jQuery.ajax({
            url:"/article/deleteresponse",
            type:"post",
            data:{"id":id2},
            success:function (result){
                if (result.data>0){
                    alert("删除成功");
                    location.href=location.href;
                }else if (result.data==-1){
                    alert("删除失败");
                }else {
                    alert("没有权限");
                }

            }
        })
    }
    function setresponse(id1){
        var responsecontent=jQuery("#"+id1);
        jQuery.ajax({
            url:"/article/setresponse",
            type:"post",
            data:{"responsecontent":responsecontent.val(),"reviewid":id1},
            success:function (result){
                if (result.data>0){
                    alert("回复成功");
                    location.href=location.href;
                }else {
                    alert("回复失败");
                }
            }
        })
    }
    function setresponse_res(id1,id2){
        var responsecontent=jQuery("#"+id1);
        jQuery.ajax({
            url:"/article/setresponse_res",
            type:"post",
            data:{"responsecontent":responsecontent.val(),"responseid":id1,"reviewid":id2},
            success:function (result){
                if (result.data>0){
                    alert("回复成功");
                    location.href=location.href;
                }else {
                    alert("回复失败");
                }
            }
        })
    }

    function log_out(){
        jQuery.ajax({
            url:"/user/log_out",
            type: "POST",
            data:{},
            success:function (result){
                if (result.data==1){
                    alert("退出登陆成功");
                    location.href="/reg.html";
                }
            }
        })
    }
    var editormd;
    function initEdit(md){
        editormd = editormd.markdownToHTML("editorDiv", {
            markdown : md, // Also, you can dynamic set Markdown text
            // htmlDecode : true,  // Enable / disable HTML tag encode.
            // htmlDecode : "style,script,iframe",  // Note: If enabled, you should filter some dangerous HTML tags for website security.
        });
    }
    function getUrlValue(key){
        var params=location.search;
        if(params.length>1){
            params=location.search.substring(1);
            var paramsarr=params.split("&");
            for(var i=0;i<paramsarr.length;i++){
                var kv=paramsarr[i].split("=");
                if(kv[0]==key){
                    return kv[1]
                }
            }
            return "";
        }
    }
    // 查询文章详情
    function getArtDetail(){
        if(id==""){
            alert("非法参数！");
            return;
        }
        jQuery.ajax({
            url:"/article/getarticlecontent",
            type:"POST",
            data:{"id":id},
            success:function(result){
                if(result!=null && result!=-1){
                    jQuery("#title").html(result.data.title);
                    jQuery("#updatetime").html(result.data.updatetime);
                    jQuery("#rcount").html(result.data.rcount);
                    initEdit(result.data.content);
                }else{
                    alert("查询失败，请重试！");
                }
            }
        });
    }
    getArtDetail();
    // 查询用户的详情信息
    function getuser(){
        var username=jQuery("#username");
        var count=jQuery("#count");
        var type_count=jQuery("#type_count");
        jQuery.ajax({
            url:"/user/infor_user",
            type:"POST",
            data:{},
            success:function (result){
                if (result!=null&&result.data.count>=0){
                    username.text(result.data.username);
                    count.text(result.data.count);
                    type_count.text(result.data.type_count);
                }else{
                    alert("用户信息查询错误");
                }
            }
        })
    }
    getuser();
    // 阅读量 +1
    function updataRCount(){
        // 先得到文章 id
        var id = getUrlValue("id");
        if(id!=""){
            jQuery.ajax({
                url:"/article/rcount",
                type:"POST",
                data:{"id":id},
                success:function(result){}
            });
        }
    }
    updataRCount();
</script>
</body>

</html>